<template>
    <a-card :bordered="false">
      <!-- <a-divider style="margin-bottom: 32px"/> -->
      <!-- <div class="title">退货进度</div> -->
       <div class="post">
          <div class="title-post" v-if="jobObj.postTitle">{{jobObj.postTitle}}
              <span class="post_status" v-if="jobObj.status==1">(招聘中)</span>
              <span class="post_status" v-if="jobObj.status==2">(已下架)</span>
          </div>
          <div class="title-post" v-else>{{jobObj.positionName}}
              <span class="post_status" v-if="jobObj.status==1">(招聘中)</span>
              <span class="post_status" v-if="jobObj.status==2">(已下架)</span>
          </div>
          <div class="bounty" v-if="jobObj.bounty">悬赏金额：{{jobObj.bounty}}元</div>
          <div class='post_tab'>
            {{jobObj.recruitProvince}}  {{jobObj.recruitCity}}
            <a-divider type="vertical"/>{{jobObj.workExperienceStr}}
            <a-divider type="vertical"/>{{jobObj.educationStr}}
          </div>
          <div class="publish_time">发布时间 {{jobObj.createTime}}</div>


       </div>
       <div class="company">
           <div class="title">招聘企业</div>
           <div class="com_name">{{jobObj.recruitCompany}}</div>
           <div class="industry">{{jobObj.positionName}}</div>
           <div class="com_intro">
             
           </div>
       </div>
       <div class="job_des">
          <div class="title">职位描述</div>
          <div class="job_des_con">
            {{jobObj.dynamicContent}}
          </div>
        
       </div>
       <div class="qrCode">
          <img :src='qrCode' alt="">
           <p>微信识别二维码查看职位详情</p>
           <a-button type="primary" icon="download" :size="size" @click='downLoad'>下载二维码</a-button>
       </div>
    
     <detail-list title="当前数据" class="data_current">
        <detail-list-item term="报名人数"><a href="">{{jobObj.onlineJoinCnt}}</a></detail-list-item>
        <detail-list-item term="评论次数">{{jobObj.commentCnt}}</detail-list-item>
        <detail-list-item term="转发次数">{{jobObj.forwardCnt}}</detail-list-item>
      </detail-list>
    </a-card>
</template>

<script>
import {details,qrCodeUrl} from '@/api/job'
import { datetimes6 } from '@/utils/util';
import DetailList from '@/components/tools/DetailList'
const DetailListItem = DetailList.Item
export default {
  components: {
    DetailList,
    DetailListItem,
  },
  data () {
    return {
      jobObj:null,
      qrCode:null
    }
  },
  created:function(){
    const that=this;
    const id = this.$route.params.id;
    details({device:5, version:3900,id:id,userId:localStorage.getItem('userId') })
    .then(res => {
    console.info(res);
    if(res.code==1){
      var dynamicAll=res.result.dynamicAll;
      if(!(dynamicAll.postTitle)) {
          dynamicAll.postTitle='';
      }
      dynamicAll.createTime=datetimes6(dynamicAll.createTime);
      that.jobObj=dynamicAll
    }
    })
   .catch((err) => {
    console.info(err)
    })
    that.qrCode='https://xsxz-dev.shouhuobao.com/rank/codeLimit?device=5&version=3900&dynamicId='+id+'&page=pages/login/login&qrCodeType=shareDetail&topicId=2';

  },
  mounted:function(){
    const that=this;
  },

  computed: {
  
  },
  methods:{
      //下载二维码
    downLoad:function(){
       window.location.href=this.qrCode;
    },
  },

}
</script>

<style lang="less" scoped>
.title{
       font-size: 20px;
       font-weight: 500;
       color: rgba(0, 0, 0, 0.85);
       margin-bottom: 3px;
       line-height: 28px;
}
 .post{
     .title-post{
       font-size: 25px;
       font-weight: 500;
       color: rgba(0, 0, 0, 0.85);
       margin-bottom: 6px;
       line-height: 30px;
    
     }
     .bounty{
        font-size: 14px;
        color: #ff4444;
        margin-bottom:6px;

     }
     .post_tab{
        margin-bottom:6px;
     }
     .publish_time{
        font-size: 12px;
        color: rgba(0, 0, 0, 0.45);
     }
 }
 .company{
     margin-top:15px;
     .com_name{
        font-size: 14px;
        color:  rgba(0, 0, 0, 0.65);
        margin-bottom:6px;
     }
    .industry{
        font-size: 14px;
        color:  rgba(0, 0, 0, 0.65);
        margin-bottom:6px;
    }
    .com_intro{
        font-size: 14px;
        color:  rgba(0, 0, 0, 0.65);
        margin-bottom:6px;
        line-height: 20px;
        width:800px;
    }

 }
 .job_des{
     margin-top:15px;
     .job_des_con{
        font-size: 12px;
        color:  rgba(0, 0, 0, 0.65);
        width:800px;
        white-space: pre-wrap;
     }
 }
 .qrCode{
    width: 300px;
    height: 300px;
    border-radius: 3px;
    margin:30px auto 60px auto;
    text-align: center;
    img{
      width: 100%;
      height: 100%;
    }
 }
 .qrCode p{
     font-size: 14px;
     color: rgba(0, 0, 0, 0.65);
     text-align: center;
     margin-top: 10px;
 }
 .data_current{
     margin-top: 103px;
 }
</style>
